<template>
<div id="charts9" ref="charts9" style="height: 400px;"></div>
</template>
<script>
  export default {
    mounted() {
      this.drawchart()
    },
    methods: {
      drawchart() {
var data = [
                        [-10,
                            20,
                            0,
                            0.75000000000000000000,
                            0,
                            0,
                            "讲者",
                            "协和医学会"
                        ],
                        [
                            6,
                            7,
                            -0.890000000000000,
                            0,
                            0,
                            0,
                            "主持人",
                            "北京地区会"
                        ],
                        [
                            19,
                            -7,
                            0,
                            0,
                            0,
                            -18.420000000000000,
                            "讲者",
                            "座谈会"
                        ],
                        [
                            -8,
                            -10,
                            0,
                            0,
                            0,
                            -18.420000000000000,
                            "出席会议",
                            "座谈会"
                        ]
                    ];
                    var textStyle = {
                        color: '#333',
                        fontStyle: 'normal',
                        fontWeight: 'normal',
                        fontFamily: 'sans-serif',
                        fontSize: 14,
                    };


                    var option = {
                        backgroundColor: 'rgba(255,255,255,0.5)',
                        title: [{
                            text: "期间：2017年",
                            x: '5%',
                            y: 0,
                            textStyle: textStyle
                        }, {
                            text: "重要会议发言",
                            x: '70%',
                            y: '5%',
                            textStyle: textStyle
                        }, {
                            text: "普通会议发言",
                            x: '15%',
                            y: '5%',
                            textStyle: textStyle
                        }, {
                            text: "普通会议出席",
                            x: '15%',
                            y: '80%',
                            textStyle: textStyle
                        }, {
                            text: "重要会议出席",
                            x: '70%',
                            y: '80%',
                            textStyle: textStyle
                        }],
                        tooltip: {
                            /*返回需要的信息*/
                            formatter: function(param) {
                                var value = param.value;
                                return '<div style="border-bottom: 1px solid rgba(255,255,255,.3); font-size: 16px;padding-bottom: 7px;margin-bottom: 7px;"> ' + value[7] + '(' + value[6] + ')' +
                                    '</div>';
                            }
                        },
                        xAxis: {
                            splitLine: {
                                show: false,
                            },
                            axisLabel: {
                                show: false
                            },
                            axisTick: {
                                show: false
                            },
                            max: 21,
                            min: -21
                        },
                        yAxis: {
                            splitLine: {
                                show: false,
                            },
                            axisLabel: {
                                show: false
                            },
                            axisTick: {
                                show: false
                            },
                            max: 21,
                            min: -21
                        },
                        series: [{
                            name: '',
                            data: data,
                            type: 'scatter',
                            symbolSize: 40,
                            itemStyle: {
                                normal: {
                                    color:'#6eba8c',
                                },
                            },
                        }]
                    };

        var mycharts = this.$echarts.init(this.$refs.charts9)
        mycharts.setOption(option)
      }
    }
  }
</script>
<style></style>
